<!--
 @description 自定义导航-导航配置
 @fileName TabConfig.vue
 @author zengqiongying
 @created 2023/08/25 16:49:26
-->
<template>
  <div class="qup-full-page" style="padding:0">
    <inside-page v-show="!showEdit" :titles="['自定义导航', `导航配置：${pageData.name}(${typeLevelName})`]" @go-back="goBack">
      <component
        :is="configComonentName"
        :define-tab-data="pageData"
        :readonly="readonly"
      />
    </inside-page>
  </div>
</template>

<script>
import { parseTime } from '@/utils'
import TabConfigList from '../tabConfig/Index'
import CateConfig from './components/CateConfig'
import DirectoryConfig from './components/DirectoryConfig'
export default {
  name: 'TabDefineConfig',
  components: { TabConfigList, CateConfig, DirectoryConfig },
  filters: {
    fiterTime: parseTime
  },
  props: {
    pageShow: {
      type: String,
      default: '' // config 导航配置 ，detail 详情
    },
    pageData: {
      type: [String, Object],
      default: ''
    },
    readonly: {
      type: Boolean,
      default: false
    } // 是否只读
  },
  data() {
    return {
      showEdit: false
    }
  },
  computed: {
    nowPageShow: {
      get() {
        return this.pageShow
      },
      set(val) {
        this.$emit('update:pageShow', val)
      }
    },
    configComonentName() {
      const { type } = this.pageData
      if ([2, '2'].includes(type)) {
        // 分类
        return 'CateConfig'
      }
      if ([3, '3'].includes(type)) {
        // 目录
        return 'DirectoryConfig'
      }
      if ([1, '1'].includes(type)) {
        // 导航
        return 'TabConfigList'
      }
      return ''
    },
    typeLevelName() {
      const { type, showLevel } = this.pageData
      const typeObj = {
        '1': '导航',
        '2': '分类',
        '3': '目录'
      }
      const levelObj = {
        '1': '一层',
        '2': '二层',
        '3': '三层'
      }
      return (typeObj[`${type}`] || '') + (levelObj[`${showLevel}`] || '')
    }
  },

  created() {},
  activated() {},

  mounted() {},

  methods: {
    goBack() {
      this.nowPageShow = false
    }
  }
}

</script>
<style lang='scss' scoped>
</style>
